 <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>提现</title>
    <link rel="stylesheet" href="css/base.css" />
    <link rel="stylesheet" href="css/all.css" />
    <link rel="stylesheet" href="css/voucher.css" />
</head>
<style>
	.name-one{
		margin-left: .3rem;
	}
	
	.bank {
			position: absolute;
			width: 100%;
			bottom: 0;
			background: #fff;
		}
		
		.bank-iocn {
			display: inline-block;
			vertical-align: middle;
			margin: -0.14rem .2rem 0 .3rem;
		}
		
		.bank-two {
			width: 100%;
			height: .98rem;
			border-bottom: .01rem solid #ddd;
			line-height: .98rem;
		}
		.modal{
			position: fixed;
		    left: 0;
		    right: 0;
		    top: 0;
		    bottom: 0;
		    display: none;
		    background: rgba(0,0,0,0.3);
		    z-index: 9999;
		}
		
		
</style>
<body>
<div>
    <div class="heads">
       <span href="javascript:;" onclick="go()"><img src="img/zuojiantou.png" alt="" class="arrows"></span>
        <h1 class="titles">提现</h1>
    </div>
    <div class="middle">
     	<div class="name" id="clickDeposit">
            <span class="name-one">点击选择提现的银行:</span>
        </div>
        <div>
            <p class="sum">提现金额</p>
            <div>
                <span class="sums">￥</span>
                <input type="text" placeholder="" class="resetUpwd-input" />
            </div>
        </div>
    </div>
    <div type="button" class="submit" >
        <button class="submits">确定</button>
    </div>
    
    
    <div class="modal">
	    <div class="bank">
			<!--<div class="bank-two">
				<img class="bank-iocn" src="img/youzheng.png" alt="">
				<span class="bank-name">邮政银行</span>
			</div>
			<div class="bank-two">
				<img class="bank-iocn" src="img/gongshang.png" alt="">
				<span class="bank-name">工商银行</span>
			</div>-->
		</div>
	</div>
</div>

<script src="js/jquery.js"></script>
<script src="js/x_rem.js"></script>
<script src="js/secondLevel.js"></script>
<script src="js/all.js"></script>
<script type="text/javascript">
	
	
	//请求自己绑定的银行
		$.ajax({
			type: "post",
			url: Url + "/bankCard/selectMyBankCard",
			xhrFields: {
				withCredentials: true
			},
			data: {
				page: "1",
				rows: "100"
			},
			success: ((data) => {
				var html = "";
				for(let i = 0; i < data.message.length; i++) {
					 var cardNum = data.message[i].cardNum.slice(-4);
					html += `
						<div class="bank-two" data-id="${data.message[i].bankCardId}">
							<img class="bank-iocn" src="${data.message[i].bankTypeId.picture}" alt="">
							<span class="bank-name" id="bankName">${data.message[i].bankTypeId.bankName}</span>
							<span class="bank-name">**** **** **** ${cardNum}</span>
						</div>
					`
				}
				$(".bank").html(html);

			}),
			error: ((err) => {
				console.log(err);
			})
		});
	
	
	 //点击选择银行
	$("#clickDeposit").click(()=>{
		$(".modal").css("display","block");   //显示自己的银行
	})
	
	
	//点击自己的银行保存Id
	var bankId = "";  //自己要提现银行的ID
	$(".bank").on("click",".bank-two",function(){
		 bankId = $(this).attr("data-id");               //保存银行ID
		$("#clickDeposit .name-one").text($(this).children("#bankName").text());      //将请选择银行的内容换成银行名字
		$(".modal").css("display","none");   //隐藏自己的银行
		 
 
	})
	
	
	//点击确定按钮
	$(".submits").click(()=>{
		
		if(bankId == ""){
			popup("请选择银行");
		}else if(!vali(".resetUpwd-input", /^\d{0,8}\.{0,1}(\d{1,2})?$/, "提现金额最多两位小数")){
			
		}else{
							
			$.ajax({
				type:"post",
				url:Url+"/ApplicationForm/addApplicationForm",
				xhrFields:{
					withCredentials: true
				},
				data:{
					"bankCardId.bankCardId":bankId,
					"money":$(".resetUpwd-input").val()
					
				},
				success:((data)=>{
					popup(data.message);
					console.log(data);
				}),
				error:((err)=>{
					console.log(err);
				})
			})
			
			
		}
		
	
	})
	
	
	
	
	
</script>
</body>
</html>